<template>
  <div>
    <GQuerySearch placeholder="请输入姓名" @setValue="setQuery" />

    <GTable
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      usePager
      :pager="frontPager"
      :data="tableData"
      stripe
      border
      :columns="columns"
      :conf="tableConf"
    >
      <template #birthday="{ row }">
        <span>{{ row.birthday | birthday }}</span>
      </template>
      <template #operation="{ row }">
        <el-button type="primary" @click="showEditForm(row.id)">查看</el-button>
        <el-button type="success" @click="submit(row.id)">通过</el-button>
        <el-button type="danger" @click="rejectLoan(row.id)">拒绝</el-button>
      </template>
    </GTable>
    <el-dialog
      :visible.sync="showEdit"
      @open="innerShow = true"
      @closed="innerShow = false"
      width="30%"
      center
      :before-close="doClose"
    >
      <p slot="title">终审审批-查看详情</p>
      <GFormCreator ref="form1" v-if="innerShow" :config="editForm">
        <span slot="btn"></span>
      </GFormCreator>
      <span slot="footer" class="dialog-footer">
        <el-button @click="showEdit = false">取 消</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import { columns, tableConf, genEditForm } from "./pageConf";
import pager from "@/mixins/pager";
import crud from "@/mixins/crud";
import { getEndLoanInfo, passEndLoan, rejectEndLoan } from "@/api/loan";

export default {
  mixins: [pager, crud],
  data() {
    return {
      tableConf,
      columns,
      showEdit: false,
      editForm: null,
      innerShow: false
    };
  },created() {
    // 测试代码
    this.load();
  },
  methods: {
    doClose() {
      this.showEdit = false;
    },
    beforeInit() {
      this.loadUrl = "/approve/end/list";
      return true;
    },
    async submit(id) {
      let isSubmit = await this.$gConfirm("是否确定通过?");
      if (!isSubmit) return;
      await passEndLoan(id);
      this.$message.success("提交成功");
      this.load();
    },
    async rejectLoan(id) {
      let isReject = await this.$gConfirm("是否确定拒绝?");
      if (!isReject) return;
      await rejectEndLoan(id);
      this.$message.success("拒绝成功");
      this.load();
    },
    async showEditForm(id) {
      const res = await getEndLoanInfo(id);
      // this.editData = res.data.data; //editData会不会变 Object.defineProperty
      this.editForm = Object.freeze(genEditForm(res.data.data)); // Object.isFrozen();
      this.showEdit = true;
    }
  }
};
</script>